import 'dart:async';

import 'package:flutter/material.dart';
import 'package:get/get.dart';

import '../../common.dart';

class LotteryDraw extends StatefulWidget {
  LotteryDraw({super.key});

  @override
  State<LotteryDraw> createState() => _SettingPageState();
}

class _SettingPageState extends State<LotteryDraw> {
  RxMap info = {}.obs;

  RxList list = [].obs;
  RxBool noClick = true.obs;
  RxInt time = 200.obs;
 
  
  getInfo() {
    getData(url: '/turntable').then((res) {
      if (res != null) {
        info.value = res;

        list.value = res['git'];

        // for(var i=0;i<list.length;i++){
        //     num[i]['text']=list[i]['git'];
        // }
        // print(num);
      }
    });
  }

  RxDouble topPosition = 1328.0.obs;
  RxDouble leftPosition = 1228.0.obs;
  RxString textPosition = 'ff'.obs;

  RxInt fastNums = 0.obs;
  RxInt slowNums = 0.obs;
  RxInt sjNum = 0.obs;
  RxMap tinfo={}.obs;

  RxInt milliseconds = 200.obs;
  RxBool loopStatus = true.obs;

  late Timer _timer;

  RxInt sel = 0.obs;




  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((_) {
      getInfo();
    });
  }

  @override
  Widget build(BuildContext context) {
   final awidth= MediaQuery.of(context).size.width;


    var num = [
    {
      'index': 0,
      'top': awidth* 0.265.toDouble(),
      'left': awidth * 0.035.toDouble(),
      'text': "",
    },
    {
      'index': 1,
      'top': awidth* 0.265.toDouble(),
      'left': awidth * 0.33.toDouble(),
      'text': "",
    },
    {
      'index': 2,
      'top': awidth* 0.265.toDouble(),
      'left': awidth * 0.625.toDouble(),
      'text': "",
    },
    {
      'index': 3,
      'top': awidth * 0.56.toDouble(),
      'text': "",
      'left': awidth * 0.035.toDouble(),
    },
    {
      'index': 4,
      'top': awidth * 0.56.toDouble(),
      'text': "",
      'left': awidth * 0.625.toDouble(),
    },
    {
      'index': 5,
      'top':  awidth * 0.85.toDouble(),
      'text': "",
      'left': awidth * 0.035.toDouble(),
    },
    {
      'index': 6,
      'top':  awidth * 0.85.toDouble(),
      'text': "",
      'left':  122.toDouble(),
    },
    {
      'index': 7,
      'top':  awidth * 0.85.toDouble(),
      'text': "",
      'left': awidth * 0.625.toDouble(),
    }
  ];
  
  loop() {
    if (sel.value > 6) {
      print('aaa');
      _timer.cancel();
      sel.value = 0;
      //  return ;
    } else {
      sel + 1;
    }

    topPosition.value = num[sel.value]['top'] as double;
    leftPosition.value = num[sel.value]['left'] as double;
  
    fastNums + 1;

    if (fastNums.value == 4) {
      fastNums.value = 0;
      milliseconds.value = 50;
      slowNums + 1;
    }
    if (slowNums.value == 7) {
      slowNums.value = 0;
      milliseconds.value = 500;
      fastNums.value = 5;
    }
    if (fastNums.value > 5) {
      if (sel.value == sjNum.value) {
        loopStatus.value = false;
        noClick.value = true;
        _timer.cancel();
      info['times']--;

        Get.dialog(
              AlertDialog(
                backgroundColor: Colors.transparent,
                content:Stack(
                  children: [
                    Image.asset(
                      'static/web/jiang/jiangping.png',
                        width: 250,
                      fit: BoxFit.fitWidth,
                    ),
                    Positioned(
                      top: 150,
                      left: 0,
                      right: 0,
                      child:Align(
                        child: Text('${tinfo['git']}',style: TextStyle(fontSize: 36,fontWeight: FontWeight.bold),),
                      )
                    ),
                    Positioned(
                      left: 30,
                      bottom: 25,
                      right: 30,
                      child:
                      GestureDetector(
                        behavior: HitTestBehavior.opaque,
                        onTap: (){
                          Get.back();
                        },
                        child: Container(
                        width: 180,
                        height: 50,
                      ),
                      )
                      
                    ),
                  ],
                ),
              ),
            );
      }
    }
    print('ppp');
    print(sel);

    if (loopStatus.value) {
      _timer =
          Timer.periodic(Duration(milliseconds: milliseconds.value), (timer) {
        _timer.cancel();

        loop();
      });
    }
  }


 

print(topPosition);
print(leftPosition);


    final totalHeight = MediaQuery.of(context).padding.top + 15;
    return Scaffold(
        backgroundColor: Color(0xff0F172B),
        body: ListView(
          padding: EdgeInsets.only(
              top: totalHeight, left: 15, right: 15, bottom: 16),
          children: [
            Row(
              children: [
                GestureDetector(
                  onTap: () {
                    Get.back();
                  },
                  child: Image.asset(
                    'static/web/bclose.png',
                    width: 16,
                    fit: BoxFit.fitWidth,
                  ),
                )
              ],
            ),
            Container(
              padding: EdgeInsets.symmetric(horizontal: 65, vertical: 10),
              child: Image.asset(
                'static/web/jiang/title.png',
                width: 16,
                fit: BoxFit.fitWidth,
              ),
            ),
            Align(
              child: Obx(
                () => Text('${info['beg']} - ${info['end']}',
                    style: TextStyle(fontSize: 16, color: Color(0XFFFFFFFF))),
              ),
            ),
            SizedBox(
              height: 10,
            ),
            
            Stack(
              children: [
                Container(
                  // margin: EdgeInsets.only(top: MediaQuery.of(context).size.height * 0.01),
                  //  padding: EdgeInsets.symmetric(horizontal: 5, vertical: 10),
                  child: Image.asset(
                    'static/web/jiang/abg.png',
                  ),
                ),
                // Positioned(
                //     child: Image.asset(
                //     'static/web/jiang/abg.png',
                //   ),
                // ),
                Positioned(
                    top: awidth * 0.05,
                    left: 0,
                    right: 0,
                    child: Align(
                      child: Obx(
                        () => Text('您还剩余 ${info['times']} 次机会',
                            style: TextStyle(
                                fontSize: 14, color: Color(0XFF0F172B))),
                      ),
                    )),
                Positioned(
                    left: 30,
                    right: 30,
                    bottom: awidth * 0.031,
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: [
                        GestureDetector(
                          behavior: HitTestBehavior.opaque,
                          onTap: () {
                            toNamed('/web_tabs/lottery/lottery_list');
                          },
                          child: Container(
                            width: 132,
                            height: 35,
                          ),
                        ),
                        GestureDetector(
                          behavior: HitTestBehavior.opaque,
                          onTap: () {
                            toNamed('/web_tabs/lottery/rule');
                          },
                          child: Container(
                            width: 132,
                            height: 35,
                          ),
                        ),
                      ],
                    )),
                Positioned(
                    top: awidth * 0.56,
                    left: 0,
                    right: 0,
                    child: Align(
                      child: GestureDetector(
                        behavior: HitTestBehavior.opaque,
                        onTap: () {
                          if (!noClick.value) {
                           showTost('请勿频繁点击');
                            return;
                          }
                          noClick.value = false;


                          postData(url: '/turntable/play').then((res) {
                            noClick.value = true;

                            if (res != null) {
                              tinfo.value = res[0];
                              if (res[0]['id'] > 4) {
                                sjNum.value = res[0]['id'] - 1;
                              } else {
                                if (res[0]['id'] == 4) {
                                  sjNum.value = 3;
                                } else {
                                  sjNum.value = res[0]['id'] - 1;
                                }
                              }

                              loopStatus.value = true;
                              fastNums.value = 0;
                              slowNums.value = 0;
                              milliseconds.value = 200;
                              sel.value = 0;

                              loop();
                            }
                          });
                        },
                        child: Container(
                          width: 100,
                          height: 100,
                        ),
                      ),
                    )),
                 Obx(() => 
                Positioned(
                     top: topPosition.value+3,
                     left: leftPosition.value-4,
                    child: Stack(
                      children: [
                        Image.asset(
                          'static/web/jiang/dong.png',
                          width: awidth * 0.28,
                          fit: BoxFit.fitWidth,
                        ),
                      ],
                    ))
                    ),
                Positioned(
                    top: awidth * 0.275,
                    left: awidth * 0.035,
                    child: Container(
                      // color: Color(0XFF333333),
                        alignment: Alignment.bottomCenter,
                        width: awidth * 0.265,
                        height: 85,
                        child: Obx(
                          () => 
                         list.isNotEmpty?
                          Text('${list[0]['git']}',
                              style: TextStyle(
                                  fontSize: 12, color: Color(0XFFFFFFFF))):SizedBox(),
                        ))),
                Positioned(
                    top: awidth * 0.275,
                    left: awidth * 0.33,
                    child: Container(
                        alignment: Alignment.bottomCenter,
                        width: awidth * 0.265,
                        height: 85,
                        child: Obx(
                          () => 
                         list.isNotEmpty?
                          Text('${list[1]['git']}',
                              style: TextStyle(
                                  fontSize: 12, color: Color(0XFFFFFFFF))):SizedBox(),
                        ))),
                Positioned(
                    top: awidth * 0.275,
                    left: awidth * 0.625,
                    child: Container(
                        alignment: Alignment.bottomCenter,
                        width: awidth * 0.265,
                        height: 85,
                        child: Obx(
                          () =>list.isNotEmpty? Text('${list[2]['git']}',
                              style: TextStyle(
                                  fontSize: 12, color: Color(0XFFFFFFFF))):SizedBox(),
                        ))),
                Positioned(
                    top:awidth * 0.57,
                    left: awidth * 0.035,
                    child: Container(
                        alignment: Alignment.bottomCenter,
                        width: awidth * 0.265,
                        height: 85,
                        child: Obx(
                          () => list.isNotEmpty?Text('${list[3]['git']}',
                              style: TextStyle(
                                  fontSize: 12, color: Color(0XFFFFFFFF))):SizedBox(),
                        ))),
                Positioned(
                    top: awidth * 0.57,
                    left: awidth * 0.625,
                    child: Container(
                        alignment: Alignment.bottomCenter,
                        width: awidth * 0.265,
                        height: 85,
                        child: Obx(
                          () => list.isNotEmpty?Text('${list[4]['git']}',
                              style: TextStyle(
                                  fontSize: 12, color: Color(0XFFFFFFFF))):SizedBox(),
                        ))),
                Positioned(
                    top: awidth * 0.86,
                    left: awidth * 0.035,
                    child: Container(
                        alignment: Alignment.bottomCenter,
                        width: awidth * 0.265,
                        height: 85,
                        child: Obx(
                          () =>list.isNotEmpty? Text('${list[5]['git']}',
                              style: TextStyle(
                                  fontSize: 12, color: Color(0XFFFFFFFF))):SizedBox(),
                        ))),
                Positioned(
                    top:  awidth * 0.86,
                    left: awidth * 0.33,
                    child: Container(
                        alignment: Alignment.bottomCenter,
                        width: awidth * 0.265,
                        height: 85,
                        child: Obx(
                          () =>list.isNotEmpty? Text('${list[6]['git']}',
                              style: TextStyle(
                                  fontSize: 12, color: Color(0XFFFFFFFF))):SizedBox(),
                        ))),
                Positioned(
                    top:  awidth * 0.86,
                    left: awidth * 0.625,
                    child: Container(
                        alignment: Alignment.bottomCenter,
                        width: awidth * 0.265,
                        height: 85,
                        child: Obx(
                          () =>list.isNotEmpty? Text('${list[7]['git']}',
                              style: TextStyle(
                                  fontSize: 12, color: Color(0XFFFFFFFF))):SizedBox(),
                        ))),
              ],
            )
          ],
        )
        );
  }
}
